<div class="mb-12 flex flex-col items-center justify-center md:flex-row">
  {{ $img := partial "utils/get-image" (dict "context" . "url" .Params.avatar "keyword" "*avatar*") }}
  {{ with $img }}
    <div class="md:ms-0 md:me-8 md:pe-8 md:border-e mx-auto w-48 flex-none">
      <img src="{{ . }}" class="rounded-full" alt="Avatar" />
    </div>
  {{ end }}
  <div class="mt-4 w-full grow md:mt-0">
    <h1 class="py-4 text-3xl">{{ .Title }}</h1>
    <div class="w-3/12 border-b xl:w-2/12"></div>

    <div class="flex items-center pt-4">
      {{ with or (.Params.role) (.Params.organizations) }}
        <i class="fas fa-user"></i>
      {{ end }}
      <div class="flex flex-wrap">
        {{ with .Params.role }}
          <span class="ps-4">{{ . | markdownify }}</span>
        {{ end }}

        {{ with .Params.organization }}
          <a href="{{ .url }}" class="ps-4">{{ .name | markdownify }}</a>
        {{ end }}
      </div>
    </div>

    {{ with .Params.bio }}
      <div class="py-8 text-lg leading-normal">
        {{ . | markdownify }}
      </div>
    {{ end }}
  </div>
  <div class="md:ms-8 flex items-end justify-center md:flex-col">
    {{ $brand := $.Param "social" }}
    {{ range $brand }}
      {{/* Deprecation warning(v1.0.0) starts */}}
      {{ if .icon_pack }}
        {{ warnf "Param 'icon_pack' in %q is deprecated and will be removed in Eureka v1.0.0. Please use 'iconPack' instead." $.File.Path }}
      {{ end }}
      {{ $iconPack := .iconPack | default .icon_pack }}
      {{/* Deprecation warning(v1.0.0) ends */}}
      {{ $src := print $iconPack " fa-" .icon }}
      <div class="mx-2 mb-2 mt-4 md:mx-0 md:mt-2">
        <a href="{{ .url }}"><i class="{{ print $src }}"></i></a>
      </div>
    {{ end }}
  </div>
</div>
<div class="prose">
  {{ .Content }}
</div>
